/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
 *
 * MoonCake v1.1 - Login Stylesheet
 *
 * This file is part of MoonCake, an Admin template build for sale at ThemeForest.
 * For questions, suggestions or support request, please mail me at maimairel@yahoo.com
 *
 * Development Started:
 * July 28, 2012
 * Last Update:
 * October 10, 2012
 *
 */

/* Body
================================================== */

body
{
    background: #fff url(../images/layout/bg/white_tiles.png);
    color: #444;
    padding: 100px 0;
}

/* Login Wrap
================================================== */

#login-wrap
{
    width: 278px;

    background: #f2f2f2 repeat-x left bottom;
    background-image: -ms-linear-gradient(top, #fafafa, #f2f2f2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fafafa), to(#f2f2f2));
    background-image: -webkit-linear-gradient(top, #fafafa, #f2f2f2);
    background-image: -o-linear-gradient(top, #fafafa, #f2f2f2);
    background-image: -moz-linear-gradient(top, #fafafa, #f2f2f2);
    background-image: linear-gradient(top, #fafafa, #f2f2f2);

    margin: auto;
    position: relative;
    border: 1px solid #ccc;
    padding: 15px;
    padding-top: 60px;

    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);

    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/* Login Buttons
================================================== */

#login-buttons
{
    position: absolute;
    top: 9px;
    left: 15px; right: 15px;
    z-index: 5;
    text-align: center;
}

#login-buttons .btn-wrap
{
    border: 1px solid #ddd;
    padding: 3px;
    display: inline-block;
    margin: 0 2px;
    *display: inline;
 /* IE7 inline-block hack */
    *zoom: 1;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

#login-buttons .btn-wrap.disabled
{
    opacity: 0.5;
    -moz-opacity: 0.5;
    filter: alpha(opacity=50);
}

#login-buttons .btn-wrap .btn
{
    margin: 0;
    padding: 4px;
    text-shadow: none !important;
}

#login-buttons .btn-wrap .btn [class^="icon-"]
{
    font-size: 21px;
    line-height: 24px;
    width: 24px;
    height: 24px;
    color: #444;
}

#login-buttons .btn-wrap .btn:hover [class^="icon-"]
{
    color: #666;
}

/* Login Inner
================================================== */

#login-inner
{
    width: 278px;
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #fff;

    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/* Login Inner Forms
================================================== */

#login-inner #login-circle .login-inner-form
{
    width: 278px;
    position: relative;
    display: none;
    left: 50%;
    margin-left: -140px;
}

#login-inner #login-circle .login-inner-form.active
{
    display: block;
}

#login-circle .login-inner-form h1
{
    font-size: 18px;
    margin: 0 0 10px 4px;
    padding: 0 15px;
}

#login-circle .login-inner-form .control-group
{
    padding: 0 15px 15px 15px;
    margin: 0;
}

#login-circle .login-inner-form .form-actions
{
    padding: 0 15px;
    margin: 0;
    background-color: transparent;
    border: none;
}

/* Login Inputs
================================================== */

#login-circle .login-inner-form input[type="text"], 
#login-circle .login-inner-form input[type="password"], 
#login-circle .login-inner-form textarea, 
#login-circle .login-inner-form select
{
    margin: 0;
    min-height: 28px;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

#login-circle .login-inner-form input.big
{
    min-height: 48px;
    margin: 0;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

#login-circle .login-inner-form input#input-username, 
#login-circle .login-inner-form input#input-password
{
    background-repeat: no-repeat;
    background-position: 6px center;
    padding-left: 28px;
}

#login-circle .login-inner-form input#input-username
{
    background-image: url(../images/icons/led/src/user.png);
    border-bottom: none;
    -webkit-border-radius: 6px 6px 0 0;
    -moz-border-radius: 6px 6px 0 0;
    border-radius: 6px 6px 0 0;
}

#login-circle .login-inner-form input#input-password
{
    background-image: url(../images/icons/led/src/key.png);
    border-top: 1px solid #ddd;
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
}

/* IE < 9 Styles
================================================== */

.lt-ie9 #login-circle .login-inner-form input[type="text"], 
.lt-ie9 #login-circle .login-inner-form input[type="password"], 
.lt-ie9 #login-circle .login-inner-form textarea, 
.lt-ie9 #login-circle .login-inner-form select
{
    min-height: 18px;
}

.lt-ie9 #login-circle .login-inner-form input.big
{
    min-height: 48px;
    margin: 0;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.lt-ie9 #login-circle .login-inner-form input.big
{
    line-height: 48px;
}

.lt-ie9 #login-circle .login-inner-form
{
    display: block;
}

.lt-ie9 #login-circle .login-inner-form.active
{
    display: block;
}
